import React, { act } from 'react';
import { render, screen, fireEvent } from '@testing-library/react';
import '@testing-library/jest-dom';
import AnnotationToolbar from '../AnnotationToolbar';

describe('AnnotationToolbar', () => {
  const mockOnToolSelect = jest.fn();

  beforeEach(() => {
    mockOnToolSelect.mockClear();
  });

  it('renders all tool buttons', async () => {
    await act(async () => {
      render(<AnnotationToolbar selectedTool="rectangle" onToolSelect={mockOnToolSelect} />);
    });
    
    expect(screen.getByTitle('方框标注')).toBeInTheDocument();
    expect(screen.getByTitle('选择工具')).toBeInTheDocument();
    expect(screen.getByTitle('橡皮擦')).toBeInTheDocument();
  });

  it('displays correct active tool', async () => {
    await act(async () => {
      render(<AnnotationToolbar selectedTool="mouse" onToolSelect={mockOnToolSelect} />);
    });
    
    const mouseButton = screen.getByTitle('选择工具');
    expect(mouseButton).toHaveClass('active');
  });

  it('calls onToolSelect when a tool button is clicked', async () => {
    await act(async () => {
      render(<AnnotationToolbar selectedTool="rectangle" onToolSelect={mockOnToolSelect} />);
    });
    
    const mouseButton = screen.getByTitle('选择工具');
    await act(async () => {
      fireEvent.click(mouseButton);
    });
    
    expect(mockOnToolSelect).toHaveBeenCalledWith('mouse');
  });

  it('has correct ARIA attributes', async () => {
    await act(async () => {
      render(<AnnotationToolbar selectedTool="rectangle" onToolSelect={mockOnToolSelect} />);
    });
    
    const toolbar = screen.getByRole('toolbar');
    expect(toolbar).toHaveAttribute('aria-label', '标注工具栏');
    
    const rectangleButton = screen.getByTitle('方框标注');
    expect(rectangleButton).toHaveAttribute('aria-pressed', 'true');
    expect(rectangleButton).toHaveAttribute('aria-label', '用于创建矩形标注框');
  });

  it('renders with correct tool icons', async () => {
    await act(async () => {
      render(<AnnotationToolbar selectedTool="rectangle" onToolSelect={mockOnToolSelect} />);
    });
    
    expect(screen.getByText('⬜')).toBeInTheDocument();
    expect(screen.getByText('🖱️')).toBeInTheDocument();
    expect(screen.getByText('🧹')).toBeInTheDocument();
  });
}); 